<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		跨域:域名,协议,端口号,只要一个不一致，还想获取数据，就是跨域
		    （后台不给你设限制）
			 
		客户端----》服务器，发送请求，要保证 
			协议（http/https)，
			域名(127.0.0.1/www.baidu.com)，
			端口号(9999/5500....),不写默认80
		一致，才能获取数据，
		这是浏览器的安全策略（同源策略）
		
		同源策略：域名，协议，端口号 一致
		
		
		客户端网址  (一定用了跨域)
		http://127.0.0.1:8848/aa2022_02/JS%E9%83%A8%E5%88%86/day0618/axios.html
		
		服务器网址(接口文档)
		http://127.0.0.1:9999/user/login
		
		工作中，到底跨域还是不跨域？
		大多数情况都是”跨域“, 
		情况1：数据很多 图片，文章，zip....，分布不同的服务器上（大公司）
		情况2：开发环境跨域，开发完成（打包后dist---》服务器)，开发代码，放到后台服务器，就没有跨域了（小公司）
	
	跨域方法：
	   1. cross跨域（后台写---知道）
	   
	      1.1 后台设置白名单就可以了
		  let safeList = ["http://127.0.0.1:8848","http://127.0.0.1:5500"];
		  origin = !safeList.includes(origin) ? '' : origin;
		  res.header("Access-Control-Allow-Origin", origin);
		  1.2 直接设置为* ----》任何源都能访问
		  res.header("Access-Control-Allow-Origin", '*');
		  res.header("Access-Control-Allow-Credentials",false);
		  前提条件：不能携带cookie

	   2. proxy跨域（前端写，必会）----vue（重新讲****）
	   
          webpack（vue)----》后期详细学
		  nodejs（后端）
		  nginx（部署）
		  
	   3. jsonp跨域（以前很火，现在不行了）
	   
	   4. postMessage、window.name、document.domin、location.hash、...这些方案结合 iframe 也可以实现跨域处理(几乎没用的)
	
	
	  <script src="axios.min.js"></script>
	  <script>
		  //cros跨域
		  //客户端：http://127.0.0.1:8848/aa2022_02/JS%E9%83%A8%E5%88%86/day0618/%E8%B7%A8%E5%9F%9F.html
		  //服务器：http://127.0.0.1:1001/list
		  axios.get("http://127.0.0.1:1001/list")
		  .then(value=>{
			 console.log(value);
		  }).catch(err=>{
			  console.log(err);
		  })
	  </script>
	</body>
</html>
